<!DOCTYPE html>
<html>
    <head>
    <title><!--{$data.title}--></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="description" content="<!--{$data.description}-->" />
    <meta name="keywords" content="{$data.keyword}" />
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,,maximum-scale=1,minimum-scale=1,user-scalable=no"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1"/>
    <!-- css -->
    <link href="/static/home/css/iconfont.css" rel="stylesheet"/>
    <link href="/static/home/css/am.css" rel="stylesheet"/>
    <link href="/static/home/css/flexslider.css" rel="stylesheet"/>
    <link href="/static/home/css/style.css" rel="stylesheet"/>
    <style>
.product_list_nav .product_listcontent .product_list_left .smallpic .flex-direction-nav a {
    background: rgba(26,126,103,0.6);
    top: 35%;
}
</style>
    <!--{$seo.head}-->
    </head>
    <body>
<!--{$seo.body}-->

<div class="wrap">
<!--导航--> 
<!--{include file='public/header' /}--> 

<!-- page_banner -->
<div class="page_banner magtopmenu">
        <div class="pagebanner_pic">
        <ul class="page_banner_slider clear">
                <!--{volist name='banner' id='v'}-->
                <li>
                <div class="pic"> <a href="<!--{$v.url}-->"> <img src="<!--{$v.img_url}-->" alt="<!--{$v.alt}-->"> </a> </div>
                <div class="desc"> 
                        <!--{$v.content}--> 
                    </div>
            </li>
                <!--{/volist}-->
            </ul>
    </div>
    </div>
<!-- page_banner end --> 

<!-- position -->
<div class="position_content">
        <div class="public">
        <div class="position"> <i class="iconfont icon-zhuye"></i> <a href="/">主页</a> > <a href="/home/product.html">产品中心</a> > <a href="<!--{$rank.uname}-->-<!--{$rank.id}-->.html"><!--{$rank.name}--></a> > <a ><!--{$data.name}--></a> </div>
    </div>
    </div>
<!-- position end --> 

<!-- page -->
<div class="page_content padtb50">
        <div class="public">
        <div class="singlepro_top">
                <h3 class="title"><!--{$data.name}--></h3>
                <div class="text"> 
                <!--{$data.content|raw}--> 
            </div>
            </div>
        <div class="product_list">
                <ul class="product_list_nav _productsort">
                <!--{php}-->$ix = 0;<!--{/php}--> 
                <!--{volist name='list' id='v'}-->
                <li class="product_listcontent clear" data-index='0'>
                        <div class="product_list_left fl"> <a  href="/product/<!--{$v.id}-->.html">
                            <div class="bigpic bigpic_0_<!--{$ix}-->">
                            <ul class="slides slides_0_<!--{$ix}-->">
                                    <!--{volist name='v.img' id='vl'}-->
                                    <li>
                                    <div class="zoom"> <img src="<!--{$vl}-->" style="height:300px;"> </div>
                                </li>
                                    <!--{/volist}-->
                                </ul>
                        </div>
                            </a>
                        <div class="smallpic">
                                <ul class="slides">
                                <!--{volist name='v.img' id='vl'}-->
                                <li>
                                        <div class="small-photo">
                                        <div class="zoom1"><img src="<!--{$vl}-->" style="width: 90px;height: 90px;"></div>
                                    </div>
                                    </li>
                                <!--{/volist}-->
                            </ul>
                            </div>
                    </div>
                        <div class="product_list_right fl"> <a  href="/product/<!--{$v.id}-->.html">
                            <h3 class="title capital"><!--{$v.name}--></h3>
                            <div class="text"><!--{$v.introduce}--></div>
                            </a>
                        <div class="text_data">
                                <table>
                                <tr class="top">
                                        <td><p><!--{$v.table_name1}--></p></td>
                                        <td><p><!--{$v.table_name2}--></p></td>
                                        <td><p><!--{$v.table_name3}--></p></td>
                                        <td><p><!--{$v.table_name4}--></p></td>
                                    </tr>
                                <tr class="bottom">
                                    <td><p><!--{$v.params['model'][0]}--><br>
                                            <!--{$v.params['model'][1] ?? $v.params['model'][1]}--></p></td>
                                    <td><p><!--{$v.params['working'][0]}--> <br>
                                            <!--{$v.params['working'][1] ?? $v.params['working'][1]}--></p></td>
                                    <td><p><!--{$v.params['laser'][0]}--><br>
                                            <!--{$v.params['laser'][1] ?? $v.params['laser'][1]}--></p></td>
                                    <td><p><!--{$v.params['size'][0]}--><br>
                                            <!--{$v.params['size'][1] ?? $v.params['size'][1]}--></p></td>
                                </tr>
                            </table>
                            </div>
                        <a class="productsmore am" href="/product/<!--{$v.id}-->.html">更多细节 </a> </div>
                    </li>
                <!--{php}-->$ix++;<!--{/php}--> 
                <!--{/volist}-->
            </ul>
            </div>
    </div>
    </div>

<!--{include file='public/footer' /}--> 
<script type="text/javascript">

    var li_list = $('.product_list_nav > .product_listcontent');
    var init_length = 0;

    $.each(li_list, function(key, val){
        var index = $(this).data('index');
        var element_length = $(".product_listcontent[data-index='"+index+"']").length;
        var smallpic = $(this).find('.smallpic');
        var bigpic = ".bigpic_"+index+"_"+init_length;
        var slides_li = ".slides_"+index+"_"+init_length+" > li";
        $(smallpic).flexslider({
            animation: "slide",
            controlNav: false,
            animationLoop: false,
            slideshow: false,
            itemWidth: 99,
            itemMargin: 0,
            asNavFor: bigpic
        });

        $(bigpic).flexslider({
            selector: slides_li,
            animation: "slide",
            controlNav: false,
            directionNav: false,
            multipleKeyboard:true,
            animationLoop: false,
            slideshow: true,
            slideshowSpeed: 99999000,
            easing:"swing",
            smoothHeight: false,
            pauseOnAction:true,
            pauseOnHover:true,
            sync: '.smallpic'
        });

        if(init_length >= element_length-1){
            init_length = 0;
        } else {
            init_length += 1;
        }
    })




    // for(var i=0;i<99999999999999;i++){



    // }
</script> 
